/**
 * 路由 Store
 * 管理动态路由、菜单数据
 */
import { defineStore } from 'pinia'
import { ref, computed } from 'vue'
import { getUserRoutes } from '@/api/modules/auth'
import { setRoutes, getRoutes as getStoredRoutes, removeRoutes } from '@/utils/storage'
import { ElMessage } from 'element-plus'
import router from '@/router'

// 🎯 Vite Glob 导入所有视图组件
const modules = import.meta.glob('@/views/**/*.vue')
console.log('📦 [RouteStore] 可用组件列表:', Object.keys(modules))

export const useRouteStore = defineStore('route', () => {
  // 状态
  const routes = ref(getStoredRoutes() || [])
  const isRoutesGenerated = ref(false)
  
  // 🎯 初始化：如果有缓存路由，尝试恢复
  const cachedRoutes = getStoredRoutes()
  if (cachedRoutes && cachedRoutes.length > 0) {
    console.log('🔄 [RouteStore] 发现缓存路由，准备恢复...')
    // 注意：这里不能立即调用 generateRoutes，因为 router 可能还未初始化
    // 应该在权限守卫中处理恢复逻辑
  }
  
  // 计算属性 - 菜单树
  const menuTree = computed(() => {
    return buildMenuTree(routes.value)
  })
  
  // 计算属性 - 扁平化菜单（用于面包屑等）
  const flatMenus = computed(() => {
    return routes.value
  })
  
  /**
   * 生成动态路由
   */
  async function generateRoutes() {
    try {
      console.log('🚀 开始生成动态路由...')
      
      // 1. 获取后端路由数据
      const backendRoutes = await getUserRoutes()
      console.log('📥 获取到后端路由:', backendRoutes)
      
      // 2. 转换为前端路由格式
      const dynamicRoutes = transformRoutes(backendRoutes)
      console.log('🔄 转换后的动态路由:', dynamicRoutes)
      
      // 3. 保存路由数据
      routes.value = backendRoutes
      setRoutes(backendRoutes)
      
      // 4. 将动态路由添加到 router（父路由名称是 'Layout'）
      dynamicRoutes.forEach(route => {
        router.addRoute('Layout', route)
      })
      console.log('✅ 动态路由已添加到 router')
      
      // 5. 添加 404 通配符路由（必须在动态路由之后添加）
      router.addRoute({
        path: '/:pathMatch(.*)*',
        redirect: '/404'
      })
      console.log('✅ 404 通配符路由已添加')
      
      isRoutesGenerated.value = true
      
      return dynamicRoutes
    } catch (error) {
      console.error('❌ 生成路由失败:', error)
      ElMessage.error('加载路由失败')
      return []
    }
  }
  
  /**
   * 转换后端路由数据为前端路由格式
   * @param {Array} backendRoutes 后端路由数据（扁平化）
   * @returns {Array} 前端路由数组
   */
  function transformRoutes(backendRoutes) {
    // 1. 构建树形结构
    const tree = buildTree(backendRoutes)
    
    // 2. 转换为前端路由格式
    const routes = tree.map(route => convertToRoute(route))
    
    return routes
  }
  
  /**
   * 构建树形结构
   * @param {Array} flatRoutes 扁平化路由数据
   * @param {number} parentId 父级 ID
   * @returns {Array} 树形路由数组
   */
  function buildTree(flatRoutes, parentId = 0) {
    const result = []
    
    for (const route of flatRoutes) {
      if (route.parentId === parentId) {
        const children = buildTree(flatRoutes, route.id)
        const node = { ...route }
        
        if (children.length > 0) {
          node.children = children
        }
        
        result.push(node)
      }
    }
    
    // 根据 meta.order 排序
    result.sort((a, b) => {
      const orderA = a.meta?.order || 0
      const orderB = b.meta?.order || 0
      return orderA - orderB
    })
    
    return result
  }
  
  /**
   * 转换单个路由为前端格式
   * @param {object} route 后端路由数据
   * @returns {object} 前端路由对象
   */
  function convertToRoute(route) {
    const frontendRoute = {
      path: route.path,
      name: route.name,
      meta: route.meta || {}
    }
    
    // 设置组件
    if (route.component) {
      // 🎯 使用 Vite Glob 导入方式
      // 将后端路径转换为匹配 glob 的格式
      // 后端: /views/home/dashboard.vue
      // Glob: /src/views/home/dashboard.vue
      const componentPath = route.component.startsWith('/') 
        ? `/src${route.component}` 
        : `/src/${route.component}`
      
      // 从 modules 中查找匹配的组件
      const componentLoader = modules[componentPath]
      
      if (componentLoader) {
        // 🎯 直接使用 loader 函数，不要用 defineAsyncComponent
        frontendRoute.component = componentLoader
        console.log('✅ [Route] 组件匹配成功:', componentPath)
      } else {
        console.error('❌ [Route] 组件未找到:', componentPath, '可用:', Object.keys(modules))
        // 使用 h 函数创建错误提示组件
        frontendRoute.component = () => import('@/views/error/404.vue').catch(() => ({
          render() {
            return null
          }
        }))
      }
    }
    
    // 设置重定向
    if (route.redirect) {
      frontendRoute.redirect = route.redirect
    }
    
    // 处理子路由
    if (route.children && route.children.length > 0) {
      frontendRoute.children = route.children.map(child => convertToRoute(child))
    }
    
    return frontendRoute
  }
  
  /**
   * 构建菜单树（用于渲染菜单）
   * @param {Array} flatRoutes 扁平化路由数据
   * @returns {Array} 菜单树
   */
  function buildMenuTree(flatRoutes) {
    return buildTree(flatRoutes).filter(route => {
      // 过滤掉不在菜单中显示的路由
      return !route.meta?.hideInMenu
    })
  }
  
  /**
   * 根据路径查找路由
   * @param {string} path 路由路径
   * @returns {object|null} 路由对象
   */
  function findRouteByPath(path) {
    return routes.value.find(route => route.path === path)
  }
  
  /**
   * 从缓存恢复路由
   * 用于页面刷新后恢复路由
   */
  function restoreRoutesFromCache() {
    try {
      console.log('🔄 [RouteStore] 从缓存恢复路由...')
      
      if (!routes.value || routes.value.length === 0) {
        console.warn('⚠️ [RouteStore] 没有缓存路由')
        return false
      }
      
      // 转换路由格式
      const dynamicRoutes = transformRoutes(routes.value)
      
      // 添加到 router（父路由名称是 'Layout'）
      dynamicRoutes.forEach(route => {
        router.addRoute('Layout', route)
      })
      
      // 添加 404 路由
      router.addRoute({
        path: '/:pathMatch(.*)*',
        redirect: '/404'
      })
      
      isRoutesGenerated.value = true
      console.log('✅ [RouteStore] 路由恢复完成')
      
      return true
    } catch (error) {
      console.error('❌ [RouteStore] 恢复路由失败:', error)
      return false
    }
  }
  
  /**
   * 重置路由状态
   */
  function resetRoutes() {
    routes.value = []
    isRoutesGenerated.value = false
    removeRoutes()
  }
  
  return {
    // 状态
    routes,
    isRoutesGenerated,
    
    // 计算属性
    menuTree,
    flatMenus,
    
    // 方法
    generateRoutes,
    restoreRoutesFromCache,
    findRouteByPath,
    resetRoutes
  }
})

